<template>
  <div class="selectELe">
    <el-select v-model="selectedLanguage" @change="changeLanguage">
      <el-option v-for="item in supportedLanguages" :value="item.value" :label="item.label" :key="item">
      </el-option>
    </el-select>
  </div>
</template>
  
<script setup>
import { ref, getCurrentInstance } from 'vue'
const supportedLanguages = [
  { value: 'en', label: "English" },
  { value: 'zh', label: "中文" },
]
const selectedLanguage = ref('zh')
const { proxy } = getCurrentInstance()
const changeLanguage = () => {
  proxy.$i18n.locale = selectedLanguage.value
}

</script>

<style>
.selectELe {
  width: 22%;
}
</style>
  